<?php if (!defined('THINK_PATH')) exit(); /*a:3:{s:91:"/Users/doyi/project/east_environmental/public/../application/index/view/login/register.html";i:1546312468;s:78:"/Users/doyi/project/east_environmental/application/index/view/common/menu.html";i:1546313291;s:80:"/Users/doyi/project/east_environmental/application/index/view/common/footer.html";i:1546106095;}*/ ?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <script src="/index/js/jquery-1.9.1.min.js"></script>
    <!--<script src="/index/js/layer.js"></script>-->
    <!---->
    <link rel="stylesheet" href="/index/libs/swiper3/css/swiper.min.css">
    <link rel="stylesheet" href="/index/libs/layui/css/layui.css">
    <link rel="stylesheet" href="/index/css/common.css">
    <link rel="stylesheet" href="/index/css/register.css">
    <link rel="stylesheet" type="text/css" href="/index/css/verify.css">

    <!---->
    <script src="/index/libs/swiper3/js/swiper.min.js"></script>
    <script src="/index/libs/layui/layui.js"></script>

    <script src="/index/js/common.js"></script>
    <!--<script src="./js/index.js"></script>-->
</head>
<body>
<div class="wrap">
    <header>
            <div class="nav wrap-w clearfix">
        <div class="fl nav-left">
            <a href="" class="logo">
                <img src="/index/images/logo_04.png" alt="">
            </a>
            <a href="javascript:void(0)" class="city-select">
                <dl>
                    <dt>
                        <em class="city">全国</em><img src="/index/images/logo_06.png" alt="">
                    </dt>
                    <dd class="clearfix">
                        <p><span>全国</span></p>
                        <p class="active"><span>福建省</span></p>
                        <?php foreach($province as $k=>$v): ?>
                        <p><span><?php echo $v['province']; ?></span></p>
                        <?php endforeach; ?>
                    </dd>
                </dl>

            </a>
            <a href="<?php echo url('index/index'); ?>" <?php if((isset($active))): if(($active == 1)): ?>class="active" <?php endif; endif; ?>>首页</a>
            <a href="<?php echo url('index/news_list',['type'=>1]); ?>" <?php if((isset($active))): if(($active == 3)): ?>class="active" <?php endif; endif; ?>>新闻中心</a>
            <a href="<?php echo url('index/activity'); ?>" <?php if((isset($active))): if(($active == 4)): ?>class="active" <?php endif; endif; ?>>促销活动</a>
            <a href="<?php echo url('index/public_info'); ?>" <?php if((isset($active))): if(($active == 2)): ?>class="active" <?php endif; endif; ?>>信息公开</a>
        </div>
        <div class="fr nav-right clearfix">
            <dl class="user">
                <dt>欢迎您！
                    <?php if((isset($user))): if((isset($user['realname']) && !empty($user['realname']))): ?>
                              <?php echo $user['user_name']; else: ?>
                    &nbsp;&nbsp;        <?php echo $user['user_name']; endif; else: ?>
                    <a href="<?php echo url('login/login'); ?>">登录</a>/<a href="<?php echo url('login/register'); ?>">注册</a>
                    <?php endif; ?>
                </dt>
                <?php if((isset($user))): ?>
                <div class="dd">
                    <dd>
                        <a href="<?php echo url('user/index',['type'=>2]); ?>"><img class="img-origin" src="/index/list0.png" alt=""><img class="img-active" src="/index/list1.png" alt="">我的订单</a>
                    </dd>
                    <!--<dd>-->
                        <!--<a href=""><img class="img-origin" src="/index/msg0.png" alt=""><img class="img-active" src="/index/msg1.png" alt="">我的邮件</a>-->
                    <!--</dd>-->
                    <dd>
                        <a href="<?php echo url('user/index'); ?>"><img class="img-origin" src="/index/set0.png" alt=""><img class="img-active" src="/index/set1.png" alt="">个人中心</a>
                    </dd>
                    <dd>
                        <a href="<?php echo url('login/login_out'); ?>"><img class="img-origin" src="/index/out1.png" alt=""><img class="img-active" src="/index/out0.png" alt="">退出登录</a>
                    </dd>
                </div>
                <?php endif; ?>
            </dl>
            <dl class="messages">
                <a href="<?php echo url('user/index',['type'=>3]); ?>"> <dt><img src="/index/images/img_06.png" alt=""></dt></a>
                <!--<div class="dd">-->
                    <!--<?php foreach($notice as $k=>$v): ?>-->

                    <!--<dd>-->
                        <!--<a href="">-->
                                <!--<?php if(($v['type'] == 1 )): ?>-->
                                <!--<span class="blue">【通知】</span>-->
                                <!--<?php endif; ?>-->
                                 <!--<?php if(($v['type'] == 2 )): ?>-->
                                <!--<span class="green">【公告】</span>-->
                                <!--<?php endif; ?>-->
                                 <!--<?php echo $v['system_title']; ?>-->
                                <!--<?php if(($k < 3)): ?>-->
                                 <!--<span class="dots"></span>-->
                                <!--<?php endif; ?>-->
                        <!--</a>-->
                    <!--</dd>-->
                    <!--<?php endforeach; ?>-->
                    <!--<dd class="more">-->
                        <!--<a href="">查看更多 ></a>-->
                    <!--</dd>-->
                <!--</div>-->

            </dl>
            <dl class="notice">
                <dt><img src="/index/images/img_72_06_03.png" alt=""><span>关注我们</span></dt>
                <div class="dd clearfix">
                    <h1>扫一扫关注我们</h1>
                    <dd class="fl">
                        <img src="/index/images/img_61.png" alt="">
                        <p>微信公众号“9999”</p>

                    </dd>
                    <dd class="fr">
                        <img src="/index/images/img_05.jpg" alt="">
                        <p>新浪微博“东方环保”</p>
                    </dd>

                </div>


            </dl>
        </div>
    </div>



    </header>
    <div class="container container-register">
        <div class="wrap-w">
            <div class="register-header clearfix">
                <div class="fl">
                    <img src="/index/images/register_03.png" alt="">注册
                </div>
                <div class="fr">我已经是会员了，去<a href="<?php echo url('login/login'); ?>">登录</a></div>
            </div>
            <div class="register-content">
                <div class="labels clearfix">
                    <p class="fl active">填写基本信息<span class="triggle"></span></p>
                    <p class="fl">填写认证资料<span class="triggle"></span></p>
                    <p class="fl">完成注册</p>
                </div>
                <div class="form register-main clearfix">
                    <div class="form-box fl">
                        <form class="layui-form" method="post" onsubmit="return false;">
                        <div class="input-box input-box-one active">
                            <div class="input">
                                <label for=""><em>*</em>用户名</label>
                                <input type="text" placeholder="请输入用户名" id="username" lay-verify="username" >
                            </div>
                            <div class="input">
                                <label for=""><em>*</em>设置密码</label>
                                <input  type="password" name="pwd" id="pwd"  autocomplete="off" placeholder="请设置密码">
                            </div>
                            <div class="input">

                                <label for=""><em>*</em>确认密码</label>
                                <input  type="password" name="respwd" id="repwd"  autocomplete="off" placeholder="请确认密码">
                            </div>
                            <!--<div class="input">-->
                                <!--<label for=""><em>*</em>验证码</label>-->
                                <!--<input type="text" class="input-code" placeholder="请输入验证码">-->
                                <!--<img src="/index/images/code_03.png"  class="code" alt="">-->
                                <!--<span class="code-change">看不清？<em>换一张</em></span>-->
                            <!--</div>-->
                            <div class="input input-check-box">
                                <input type="checkbox" class="checkbox"  placeholder="请输入验证码">我阅读并同意<a href="" class="word-read">《东方环保注册协议》</a>
                            </div>
                            <div class="input">
                                <button  class="btn-next" id="step_1">下一步</button>
                            </div>
                            <script>

                            </script>

                        </div>


                        <div class="input-box input-box-two">
                            <div class="input">

                                <label for="">手机号</label>
                                <input type="text" maxlength="11" placeholder="请输入手机号码" name="phone" id="phone">
                            </div>
                            <div class="input clearfix">
                                <div class="input-model fr bg-start current">
                                    <img src="/index/images/status_06.png" alt="">点击按钮进行验证
                                </div>
                                <div class="input-model fr bg-ing">
                                    <em></em><em></em><em></em>
                                </div>
                                <div class="input-model fr bg-end">
                                    <img src="/index/images/status_06.png" alt="">验证成功！
                                </div>
                                <div id="verify-code">
                                </div>
                            </div>


                            <div class="input">
                            <label for=""><em>*</em>短信验证</label>
                            <input type="text" class="input-code" placeholder="请输入验证码" id="vcode" name="vcode" lay-verify="required|vcode">
                            <span class="code-change">点击发送验证码</span>
                            </div>
                            <div class="input">

                                <label for="">邮箱</label>
                                <input type="text" placeholder="请输入邮箱" name="email" id="email">
                            </div>
                            <div class="input">
                                <button  class="btn-next submit-btn" id="step_2">下一步</button>
                            </div>


                        </div>


                        <div class="input-box input-box-three">

                                <p class="finish-title">
                                    <img src="/index/images/state_03.png" alt="">完成注册
                                </p>
                               <p class="state-finish">恭喜您已成功注册为东方环保会员</p>
                                <button class="btn-return"><a href="<?php echo url('index/index'); ?>">返回首页</a></button>
                        </div>
                        </form>
                    </div>
                    <div class="fr-img fr">
                        <img src="/index/images/register_07.png" alt="">
                    </div>
                </div>
            </div>

        </div>
    </div>
    <footer>
    <div class="footer-menu">

        <div class="wrap-w clearfix">
            <dl>
                <dt>
                    我们的服务
                </dt>
                <dd><a href="">线下服务</a></dd>
                <dd><a href="">订单系统</a></dd>
            </dl>
            <dl>
                <dt>
                    关于我们
                </dt>
                <dd><a href="">公司介绍</a></dd>
                <dd><a href="">团队介绍</a></dd>
                <dd><a href="">联系方式</a></dd>
            </dl>
            <dl>
                <div class="erwei fl">
                    <img src="/index/images/1544099144.png" alt="">
                    <p>官方微信</p>
                </div>
                <div class="fl">
                    <dt>
                        联系我们
                    </dt>
                    <dd class="footer-phone"><a href=""><img src="/index/images/phone_03.png" alt="">400-222-8888</a></dd>
                    <dd><a href="javascript:void(0);">地址：福建省晋江市安东开发区</a></dd>
                </div>
            </dl>
            <!--<dl>-->
            <!--<dt>-->
            <!--联系我们-->
            <!--</dt>-->
            <!--<dd><a href=""><img src="/index/images/phone_03.png" alt="">400-222-8888</a></dd>-->
            <!--<dd><a href="javascript:void(0);">地址：福建省晋江市安东开发区</a></dd>-->
            <!--</dl>-->
        </div>
    </div>
    <p class="foot">Copyright©2015-2018，版权所有 上海敖智信息科技有限公司 泸ICP备14021067号 </p>
</footer>
</div>
<script type="text/javascript" src="/index/js/verify.js" ></script>
<script>
    layui.use(['form', 'layedit', 'laydate'], function() {
        var form = layui.form
                , layer = layui.layer
                , layedit = layui.layedit
                , laydate = layui.laydate;




    $('.btn-next').on('click',function(){

var _index = $(this).parents('.input-box').index();

        if(_index == 0){

            var username = $('#username').val();
            var pwd = $('#pwd').val();
            var repwd = $('#repwd').val();
            var checkbox = $('input[type="checkbox"]:checked').val();
            if(username.length <=0){
                layer.msg('用户名不能为空', {
                    time: 2000, //20s后自动关闭

                });
            }else if(pwd.length <=0){
                layer.msg('密码不能为空', {
                    time: 2000, //20s后自动关闭

                });
            }else if(checkbox != 'on'){
                layer.msg('请确认协议', {
                    time: 2000, //20s后自动关闭

                });
            }else if(repwd != pwd){
                layer.msg('两次密码不一致', {time: 2000});
            }else{
                $('.register-content p').eq(_index+1).addClass('active');
                $('.form-box .input-box').eq(0).removeClass('active');
                $('.form-box .input-box').eq(1).addClass('active');
            }







        }
        if(_index == 1){
            var myregPhone = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/;  //手机正则式
            var myregEmail = /^[a-z0-9._%-]+@([a-z0-9-]+\.)+[a-z]{2,4}$|^1[3|4|5|7|8]\d{9}$/;  // 邮箱正则式
            var phone = $('#phone').val();
            var vcode = $('#vcode').val();
            var email = $('#email').val();

            var username = $('#username').val();
            var pwd = $('#pwd').val();
            var repwd = $('#repwd').val();
            console.log(username);
            console.log(pwd);
            console.log(repwd);
            if(phone.length <=0){
                layer.msg('手机号不能为空', {
                    time: 2000, //20s后自动关闭

                });
            }else if(!myregPhone.test(phone)){
                layer.msg('手机号不正确', {
                    time: 2000, //20s后自动关闭

                });
        //    }else if(vcode.length <= 0) {
        //         layer.msg('验证码不能为空', {
        //             time: 2000, //20s后自动关闭
        //
        //         });
            // }else if(vcode != 1){
            //     layer.msg('验证码不正确', {
            //         time: 2000, //20s后自动关闭
            //
            //     });
            // }else if(vcode != 1){
            //     layer.msg('验证码不正确', {
            //         time: 2000, //20s后自动关闭
            //
            //     });
            // }else if(email.length <= 0){
            //     layer.msg('邮箱不能为空', {
            //         time: 2000, //20s后自动关闭
            //
            //     });
            // } else if(!myregEmail.test(email)){
            //     layer.msg('邮箱格式不正确', {
            //         time: 2000, //20s后自动关闭
            //
            //     });
            }else{
                $.ajax({
                    type:'post',
                    url:'/index/login/register_in',
                    dataType:'json',
                    data:{
                        'username':username,
                        'password':pwd,
                        'password1':repwd,
                        'phone':phone,
                        'email':email,
                    },
                    success:function (data) {
                        if(data.code == 200){
                            // layer.msg(data.msg);
                            $('.register-content p').eq(_index+1).addClass('active');
                            $('.form-box .input-box').eq(1).removeClass('active');
                            $('.form-box .input-box').eq(2).addClass('active');
//                            window.location.href='/index/login/login';
                        }else{
                            layer.msg(data.msg);
                        }
                    }
                });

            }
        }


    })


    });


    $('.bg-start').on('click',function(){
        $('#verify-code').fadeIn();
    })
    $('.verify-move-block').on('click',function(){
        $('.bg-start').hide();
        $('.bg-ing').show();
    })
    //滑动验证
    $('#verify-code').slideVerify({
        type : 2,		//类型
        vOffset : 5,	//误差量，根据需求自行调整
        vSpace : 5,	//间隔
        imgName : ['1.jpg', '2.jpg'],
        imgSize : {
            width: '310px',
            height: '200px',
        },
        blockSize : {
            width: '40px',
            height: '40px',
        },
        barSize : {
            width : '310px',
            height : '40px',
        },
        ready : function() {

        },
        success : function() {
            $('.bg-start').hide();
            $('.bg-ing').hide();
            $('#verify-code').hide();
            $('.bg-end').show();

        },
        error : function() {
//		        	alert('验证失败！');
        }

    });

//校验

//    layui.use(['form', 'layedit', 'laydate'], function() {
//        var form = layui.form
//                , layer = layui.layer
//                , layedit = layui.layedit
//                , laydate = layui.laydate;
//
//
//
//    });



</script>
</body>